@default-main-color: #1c71fb;
@default-bg-color: #f4f4f4;
@default-main-font-color: #4c4c4c;
@default-vice-font-color: #898989;
@default-disabled-bg-color: #f5f7fa;
@default-disabled-font-color: #c0c4cc;
@default-range-middle-background-opacity: 0.1;

:root {
  --hash-calendar-main-color: @default-main-color;
  --hash-calendar-bg-color: @default-bg-color;
  --hash-calendar-main-font-color: @default-main-font-color;
  --hash-calendar-vice-font-color: @default-vice-font-color;
  --hash-calendar-disabled-bg-color: @default-disabled-bg-color;
  --hash-calendar-disabled-font-color: @default-disabled-font-color;
  --hash-calendar-range-middle-background-opacity: @default-range-middle-background-opacity;
}

// 页面主色
@main-color: var(--hash-calendar-main-color, @default-main-color);
//页面背景色
@bg-color: var(--hash-calendar-bg-color, @default-bg-color);
//主文字颜色
@main-font-color: var(
  --hash-calendar-main-font-color,
  @default-main-font-color
);
//副文字颜色
@vice-font-color: var(
  --hash-calendar-vice-font-color,
  @default-vice-font-color
);
//禁用背景颜色
@disabled-bg-color: var(
  --hash-calendar-disabled-bg-color,
  @default-disabled-bg-color
);
//禁用文字颜色
@disabled-font-color: var(
  --hash-calendar-disabled-font-color,
  @default-disabled-font-color
);

// 根据属性生成不同的样式表达式
.genColor(@prop, @color) {
  @{prop}: @color;
}

// 定义一系列颜色变量适配函数
.mainColor(@prop) {
  .genColor(@prop, @main-color);
}
.bgColor(@prop) {
  .genColor(@prop, @bg-color);
}
.mainFontColor(@prop) {
  .genColor(@prop, @main-font-color);
}
.viceFontColor(@prop) {
  .genColor(@prop, @vice-font-color);
}
.disabledBgColor(@prop) {
  .genColor(@prop, @disabled-bg-color);
}
.disabledFontColor(@prop) {
  .genColor(@prop, @disabled-font-color);
}
